import React, { useState } from "react";

// 1. 是一个普通函数
export function logMouse(Xxx) {
  // 2. 函数内部, 定义一个组件, 组件内封装逻辑
  function Mouse() {
    const [mouse, setMouse] = useState({ x: 0, y: 0 });
    const handleMouseMove = (e) => {
      setMouse({ x: e.clientX, y: e.clientY });
    };

    // 3. 函数的参数, 接收一个组件, 作为内置组件的子组件
    return (
      <Xxx
        // 4. 内置组件, 通过父传子, 给参数组件, 传递逻辑
        mouse={mouse}
        handleMouseMove={handleMouseMove}
      />
    );
  }

  // 5. 返回内置组件
  return Mouse;
}
